Laravel 7/6 Auth Login with Username or Email Tutorial

Let’s start with how to login with username or email in laravel 7/6 auth. i will give you simple solution of laravel 7/6 login with username or email in authentication. it’s easy to make auth login with username and email address in laravel 7/6 application.

Sometime, we need to create login page with username or email address to login. it’s great function if you have in your website because it’s really easy to remember anyone to your customer. customer if forgot email then he has one username. So it’s really helps.

In laravel 6, i will give how you can setup for login with username or email step by step. so let’s follow bellow steps.

Step 1: Install Laravel 6

first of all we need to get fresh Laravel 6 version application using bellow command, So open your terminal OR command prompt and run bellow command:

composer create-project --prefer-dist laravel/laravel blog

Step 2: Install Laravel UI

You have to follow few step to make auth in your laravel 6 application.

First you need to install laravel/ui package as like bellow:

composer require laravel/ui

Step 3: Generate Auth Scaffold

Here, we need to generate auth scaffolding in laravel 6 using laravel ui command. so, let’s generate it by bellow command:

php artisan ui bootstrap --auth

Now you need to run npm command, otherwise you can not see better layout of login and register page.

Install NPM:

npm install

Run NPM:

npm run dev

Step 4: Add Username Column

Now add new column username to your users table, so you can simply update your migration as like bellow.

migration

<?php
  
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
  
class CreateUsersTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('name');
            $table->string('email');
            $table->string('username')->nullable();
            $table->timestamp('email_verified_at')->nullable();
            $table->boolean('is_admin')->nullable();
            $table->string('password');
            $table->rememberToken();
            $table->timestamps();
        });
    }
  
    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('users');
    }
}

Now you can run migration

php artisan migrate

Step 5: Update Login View

Laravel has created default login blade file. we need to add comman username field on it and remove email field. so let’s update like as bellow:

resources/views/auth/login.blade.php

....
<div class="form-group row">
    <label for="username" class="col-md-4 col-form-label text-md-right">Username Or Email</label>
   
    <div class="col-md-6">
        <input id="username" type="username" class="form-control @error('username') is-invalid @enderror" name="username" value="{{ old('username') }}" required  autofocus>
   
        @error('username')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror
    </div>
</div>
....

Step 6: Overwrite Login method

Now we have to overwrite login with on LoginController file. so let’s add logincontroller like as bellow:

app/Http/Controllers/Auth/LoginController.php

<?php
  
namespace App\Http\Controllers\Auth;
  
use App\Http\Controllers\Controller;
use Illuminate\Foundation\Auth\AuthenticatesUsers;
use Illuminate\Http\Request;
  
class LoginController extends Controller
{
  
    use AuthenticatesUsers;
    
    protected $redirectTo = '/home';
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function __construct()
    {
        $this->middleware('guest')->except('logout');
    }
  
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function login(Request $request)
    {   
        $input = $request->all();
  
        $this->validate($request, [
            'username' => 'required',
            'password' => 'required',
        ]);
  
        $fieldType = filter_var($request->username, FILTER_VALIDATE_EMAIL) ? 'email' : 'username';
        if(auth()->attempt(array($fieldType => $input['username'], 'password' => $input['password'])))
        {
            return redirect()->route('home');
        }else{
            return redirect()->route('login')
                ->with('error','Email-Address And Password Are Wrong.');
        }
          
    }
}

You can add some dummy records on your users table.

Now you can run your project.

You will get layout of login page like as bellow:

I hope it can help you…